<template>
  <div class="sm-spm-topSearch">
    <ul>
      <li>
        机型: <el-input  ref="saomaInput" size="mini" v-model="searchData.productCode" placeholder="请输入内容" ></el-input>
      </li>
      <li>
        <span >AO编码:</span> <el-input  ref="saomaInput" size="mini" v-model="searchData.aoCode" placeholder="请输入内容" ></el-input>
      </li>
      <li>
        工作包编码: <el-input  ref="saomaInput" size="mini" v-model="searchData.packageCode" placeholder="请输入内容" ></el-input>
      </li>
      <li>
        图号: <el-input  ref="saomaInput" size="mini" v-model="searchData.itemCode" placeholder="请输入内容" ></el-input>
      </li>
      <li>
        是否分拣:<el-select ref="saomaInput" size="mini" v-model="searchData.isSort" placeholder="请选择">
                <el-option
                  v-for="item in isSortStatus"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option></el-select> 
      </li>
      <li>
        配套状态:<el-select ref="saomaInput" size="mini" v-model="searchData.state" placeholder="请选择">
                <el-option
                  v-for="item in stateStatus"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option></el-select> 
      </li>
      <!-- <li>
        机型 <el-input  ref="saomaInput" size="mini" v-model="searchData.productCode" placeholder="请输入内容" ></el-input>
      </li> -->
      <!-- <li>
        机型 <el-input  ref="saomaInput" size="mini" v-model="searchData.productCode" placeholder="请输入内容" ></el-input>
      </li> -->
      <li class="sm-spm-choiceli">  批次: <el-input ref="saomaInput" size="mini" v-model="searchData.batchNo"  placeholder="请输入内容" ></el-input>
      </li>
      <li class="sm-spm-choiceli"> <span > 起始架次:</span> <el-input ref="saomaInput" size="mini"  v-model="searchData.startPlaneNo" placeholder="请输入内容" ></el-input>
      </li>

      <li>
        开始时间:
        <el-date-picker
            size="mini"
            v-model="searchData.startTime"
            type="date"
            placeholder="选择日期"
            value-format="yyyy-MM-dd"
          ></el-date-picker>
      </li>
      <li>
        结束时间:
        <el-date-picker
            size="mini"
            v-model="searchData.endTime"
            type="date"
            placeholder="选择日期"
            value-format="yyyy-MM-dd"
          ></el-date-picker>
      </li>
      <li class="sm-spm-choiceli">
      <el-button size="mini" type="primary" @click="smSpmSearch">查询</el-button>
      <el-button type="primary" size="mini" @click="doReset">重置</el-button>

        
      </li>
    </ul>
  </div>
</template>
<script>
import { smSpmTopTableData } from "@/utils/api.js"
export default {
  name: "topSearch",
  data() {
    return {
      isSortStatus: [
        {
          value: "Y",
          label: "已分拣",
        },
        {
          value: "N",
          label: "未分拣",
        },
        {
          value: "",
          label: "所有",
        },
      ],
      stateStatus: [
        {
          value: "02",
          label: "已配套",
        },
        {
          value: "00",
          label: "未配套",
        },
        {
          value: "04",
          label: "缺配",
        },
        {
          value: "",
          label: "所有",
        },
      ],
      // options3: [
      //   {
      //     value: "选项1",
      //     label: "状态一",
      //   },
      //   {
      //     value: "选项2",
      //     label: "状态二",
      //   },
      // ],
      // value1: "",
      // value2: "",
      // value3: "",
      searchData:{
        productCode:'',
        batchNo:'',
        startPlaneNo:'',
        startTime:'',
        endTime:'',
        aoCode:"",
        packageCode:"",
        isSort:"",
        state:"",
        itemCode:""
      },
      pageSize:20,
      pageNumber:1
    };
  },
  methods:{
    //重置
    doReset(){
        Object.assign(this.searchData,this.$options.data().searchData);
    },
    smSpmSearch(){
      smSpmTopTableData({
        searchParams:{
          productCode:this.searchData.productCode,
          batchNo:this.searchData.batchNo,
          startPlaneNo:this.searchData.startPlaneNo,
          startTime:this.searchData.startTime,
          endTime:this.searchData.endTime,
          aoCode:this.searchData.aoCode,
          packageCode:this.searchData.packageCode,
          isSort:this.searchData.isSort,
          state:this.searchData.state,
          itemCode:this.searchData.itemCode
        },
        pageParameter:{
          rows:6,
          page:1
        }
      }).then((res)=>{
        if(res.data.retCode == 200){
          this.$bus.$emit('smSpmTopSearchData',res)
        }
        console.log('预配套上表查询',res)
      })
    }
  },
  mounted(){
    // 接收Top表的分页--每页条数--进行查询
    this.$bus.$on('smSpmToptablePageSize',(e)=>{
      this.pageSize = e
      smSpmTopTableData({
        searchParams:{
          productCode:this.searchData.productCode,
          batchNo:this.searchData.batchNo,
          startPlaneNo:this.searchData.startPlaneNo,
          startTime:this.searchData.startTime,
          endTime:this.searchData.endTime,
          aoCode:this.searchData.aoCode,
          packageCode:this.searchData.packageCode,
          isSort:this.searchData.isSort,
          state:this.searchData.state,
          itemCode:this.searchData.itemCode
        },
        pageParameter:{
          rows:this.pageSize,
          page:this.pageNumber
        }
      }).then((res)=>{
        if(res.data.retCode == 200){
          this.$bus.$emit('smSpmTopSearchData',res)
        }
        console.log('配套任务上表查询',res)
      })
    })
    // 接收Top表的分页--页数--进行查询
    this.$bus.$on('smSpmToptablePageNumber',(e)=>{
      this.pageNumber = e
      smSpmTopTableData({
        searchParams:{
          productCode:this.searchData.productCode,
          batchNo:this.searchData.batchNo,
          startPlaneNo:this.searchData.startPlaneNo,
          startTime:this.searchData.startTime,
          endTime:this.searchData.endTime,
          aoCode:this.searchData.aoCode,
          packageCode:this.searchData.packageCode,
          isSort:this.searchData.isSort,
          state:this.searchData.state,
          itemCode:this.searchData.itemCode
        },
        pageParameter:{
          rows:this.pageSize,
          page:this.pageNumber
        }
      }).then((res)=>{
        if(res.data.retCode == 200){
          this.$bus.$emit('smSpmTopSearchData',res)
        }
        console.log('配套任务上表查询',res)
      })
    })
  }
};
</script>
<style scoped>
.sm-spm-topSearch {
  padding: 5px 3px;
  width: 100%;
  height: 100%;
  margin-top: 10px;
  overflow: hidden;
}
.sm-spm-topSearch ul li {
    float: left;
    margin-left: 5px;
}
.sm-spm-choiceli {
    margin-left: 10px;
}
.el-select {
    width: 120px;
}
.el-input {
  width: 150px;
}
</style>